<template>
  <div class="w-[1170px]">
    <a-table
      :loading="loading"
      :columns="columns"
      :data="tableData"
      :scroll="{
        x: 2000,
        y: 500
      }"
      row-key="id"
      :pagination="false"
    >
      <template #handle="{}">
        <a-button type="text" @click="$router.push({ name: 'modifyAllocation' })"
          >修改配置</a-button
        >
        <a-button type="text" @click="$router.push({ name: 'amortizeDetail' })">查看详情</a-button>
      </template>
    </a-table>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';

const loading = ref(false);
const tableData = ref([
  {
    id: 1,
    code: 'ZY10020240701140801',
    name: '科学研究数据资产',
    version: 1,
    rubiao_amount: '0',
    method: '直线法',
    useful_life: '6年',
    amortization_status: 0,
    amortization_amount: '166.67',
    amortization_date: '2025-01-12',
    remaining_amount: '0',
    amortized_amount: '0',
    asset_spec: '无形资产',
    done: false
  },
  {
    id: 2,
    code: 'ZY10020240701142721',
    name: '环境监测数据',
    version: 1,
    rubiao_amount: '0',
    method: '直线法',
    useful_life: '3年',
    amortization_status: 2,
    amortization_amount: '0',
    amortization_date: '2026-01-13',
    remaining_amount: '0',
    amortized_amount: '0',
    asset_spec: '无形资产',
    done: false
  }
]);

const columns = [
  { title: '资产编号', dataIndex: 'code' },
  { title: '资产名称', dataIndex: 'name' },
  { title: '资产版本', dataIndex: 'version', customRender: ({ record }) => `V${record.version}.0` },
  { title: '入表金额', dataIndex: 'rubiao_amount' },
  { title: '摊销方式', dataIndex: 'method' },
  { title: '使用寿命', dataIndex: 'useful_life' },
  { title: '摊销进度', dataIndex: 'amortization_status' },
  { title: '下次摊销金额', dataIndex: 'amortization_amount' },
  { title: '下次摊销时间', dataIndex: 'amortization_date' },
  { title: '剩余金额', dataIndex: 'remaining_amount' },
  {
    title: '操作',
    dataIndex: 'actions',
    width: 250,
    fixed: 'right',
    slotName: 'handle'
  }
];
</script>
